<template>
  <div>
 <div class="list"  v-for='(item,index) in records' :key='index'>
      <br>
<van-row type="flex" justify="center">
  <van-col span="5">商品详情</van-col>
  <van-col span="13"></van-col>
  <van-col span="2"><van-icon name="arrow"  @click="detail(item.serialNo)" /></van-col>
</van-row>
<!-- 分割线 -->
<van-divider
  :style="{ borderColor: 'gray',paddingTop: '.1rem' }"
>
</van-divider>
 <!-- 卡片 -->
 <van-card :style="{paddingTop: '.1rem' }"
  thumb="https://img01.yzcdn.cn/vant/ipad.jpeg"
>
 <template #tags >
     <p>{{item.title}}</p>
     <p>下单时间  <i>{{item.orderTime}}</i></p>
     <p> 下单人  <i>{{item.orderUserName}}</i></p>
  </template>
</van-card>
<!-- 按钮 -->
<van-row type="flex" justify="center" :style="{paddingTop: '.1rem' }">
  <van-col span="18"></van-col>
  <van-col span="6"><van-button  @click='Send(item.serialNo)' color="#ffcc33" round v-if='item.status==0'>待发货</van-button>
  <van-button color="#ffcc33" @click='rece(item.serialNo)' round v-else-if='item.status==10'>待收货</van-button>
  <van-button color="#ffcc33" round v-else-if='item.status==20'>未评价</van-button>
  <van-button color="#ffcc33" round v-else-if='item.status==30'>已评价</van-button></van-col>
</van-row>
    </div>
  </div>
</template>

<script>
import detail from './detail.vue'
import {getPaddingRecevie,recevie,getDetail} from '../../request/api'
export default {
data(){
  return{
    records:[]
  }
},
components:{
   detail
 },
created(){
   getPaddingRecevie({
     current:'1',
     size:'5'
     
   }).then(res=>{
     console.log(res.data);
     this.records=res.data.records
   })
},
methods:{
       rece(val){
         this.$toast('收货成功')
          recevie(val).then(res=>{
            console.log(val);
            console.log(res);
          })
       },
        detail(val){
         getDetail(val).then(res=>{
           console.log(res.data);
         })
       },
 }
}

</script>

<style lang='less' scoped>
.list{
  margin: 5% 0;
}
.van-card{
  background: white;
}
</style>